﻿@{
    ViewBag.Title = "Login";
    Layout = "~/Views/Shared/StandardLayout.cshtml";
}


<div class="login-screen">
    <div class="login-form">
        <h1>系统管理登录</h1>
        <div class="control-group">
            <input name="username" type="text" id="username" class="login-field" placeholder="用户名" title="用户名" autofocus>
            <label class="login-field-icon user" for="txtUserName"></label>
        </div>
        <div class="control-group">
            <input name="password" type="password" id="password" class="login-field" placeholder="密码" title="密码">
            <label class="login-field-icon pwd" for="Pwd"></label>
        </div>
        @*<div id="divValidateNum" class="control-group">
                <table>
                    <tr>
                        <td>
                            <input name="ValidateNum" type="text" id="ValidateNum" class="txt" style=" height:30px; width:150px;" />
                        </td>
                        <td>
                            <img style="cursor: pointer;" border="0" id="imgValidate" src="handler/Pub/PubValidateImg.ashx" height="30px" onclick="var curTime=new Date();this.src='handler/Pub/PubValidateImg.ashx?date='+curTime.toString();" />
                        </td>
                    </tr>
                </table>
            </div>*@
        <div>
            <input id="btnSubmit" type="button" name="btnSubmit" value="登 录" class="btn-login" onclick="login();">
        </div>
        <div id="divMsg" class="login-tips"><i></i><span>请输入用户名和密码</span></div>
    </div>
</div>
<div class="bottom">
    <div>为达到最优体验,请使用谷歌或IE8以上浏览器！</div>
    <div style=" padding:5px;"><a href="http://rj.baidu.com/soft/detail/14744.html?ald" target="_blank">谷歌浏览器下载</a> </div>
</div>

@section Style{
    <style type="text/css">
        body {
            background-color: #4EA6D8;
        }

        a {
            color: White;
        }

        .txt {
            /*height:16px;默认高度*/
            padding: 2px 8px 0pt 3px;
            height: 18px;
            border: 1px solid #CCC;
        }
        /* =========================登录页样式.开始======================= */
        .login-screen {
            position: absolute;
            top: 50%;
            left: 54%;
            margin-top: -160px;
            margin-left: -245px;
            width: 490px;
            text-align: left;
        }

        .login-icon {
            float: left;
            width: 96px;
            height: 96px;
            text-indent: -9999px;
            background: url(/Content/themes/willow/images/logo.png) no-repeat;
        }

            .login-icon > h4 {
                margin-top: 4px;
                color: #fff;
                font-size: 17px;
                font-weight: 200;
                line-height: 34px;
                opacity: 0.95;
            }

                .login-icon > h4 small {
                    color: inherit;
                    display: block;
                    font-size: inherit;
                    font-weight: 700;
                }

        .login-form {
            float: left;
            margin-left: -5px;
            padding: 20px 25px 25px 25px;
            width: 310px;
            background: #ECEFF1;
            border-radius: 6px;
            text-align: center;
            -webkit-box-shadow: 2px 2px 3px #aaa;
            -moz-box-shadow: 2px 2px 3px #aaa;
            filter: progid:DXImageTransform.Microsoft.Shadow(Strength=3, Direction=135, Color='#999999');
            box-shadow: 2px 2px 0 rgba(0, 0, 0, 0.1);
        }

            .login-form h1 {
                display: block;
                margin-bottom: 20px;
                border-bottom: 1px solid #DFDFDF;
                height: 40px;
                line-height: 30px;
                color: #304b65;
                font-size: 21px;
                font-weight: 300;
                font-family: 'Microsoft YaHei';
            }

        .control-group {
            position: relative;
            margin-bottom: 6px;
        }

        .login-field {
            display: inline-block;
            padding: 11px 0 11px 10px;
            width: 296px;
            height: 20px;
            line-height: 20px;
            color: #ACB6C0;
            font-size: 17px;
            background: #fff;
            border: 1px solid #E5E5E5;
            border-radius: 6px 6px 6px 6px;
            margin-bottom: 10px;
            vertical-align: middle;
        }

            .login-field:focus {
                border: 1px solid #BBD5EA;
            }

        .placeholder {
            color: #999;
        }

        .login-field-icon {
            position: absolute;
            display: block;
            top: 14px;
            right: 13px;
            width: 16px;
            height: 20px;
            cursor: pointer;
            background: url(/Content/themes/willow/images/skin_icons.png) no-repeat;
        }

            .login-field-icon.user {
                background-position: -1px -137px;
            }

            .login-field-icon.pwd {
                background-position: -28px -137px;
            }

        .btn-login {
            display: block;
            margin: 0;
            padding: 10px 0;
            width: 100%;
            color: #fff;
            border: 2px solid #ECEFF1;
            border-radius: 6px 6px 6px 6px;
            background: #33B5E5;
            font-size: 16.5px;
            text-decoration: none;
            cursor: pointer;
            *border: 0;
            text-align: center;
        }

        .login-tips {
            display: none;
            margin: 15px auto 0 auto;
            height: 14px;
        }

            .login-tips i {
                display: inline-block;
                margin-right: 5px;
                width: 14px;
                height: 14px;
                background: url(/Content/themes/willow/images/skin_icons.png) -56px -140px no-repeat;
                text-indent: -9999px;
                vertical-align: middle;
            }

            .login-tips span {
                display: inline-block;
                height: 14px;
                line-height: 14px;
                font-size: 14px;
                font-weight: normal;
                color: Orange;
                vertical-align: middle;
            }

        .bottom {
            text-align: center;
            position: absolute;
            bottom: 0;
            padding-bottom: 10px;
            width: 99%;
            font-size: 14px;
            font-family: Tahoma,Verdana,微软雅黑,新宋体;
            color: White;
        }
    </style>
}
@section Script{
    <script>
        //登陆
        function login() {
            $('#divMsg').show().children('span').text('登录中...');
            var url = '@Url.Action("Login")';
            var postData = {
                username: $('#username').val(),
                password: $('#password').val()
            }
            $.post(url, postData, function (data) {
                var callback = null;
                if (data.Result) {
                    location.href = '@Url.Action("Index","Home")';
                } else {
                    $('#divMsg span').text(data.Message);
                }
            });
        }

        //回车登录
        function keyEnter() {
            if (event.keyCode == 13) {
                login();
            }
        }
        document.onkeydown = keyEnter;
    </script>
}

